<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>form</title>
</head>
<body>
	<form action="">
		用户名: <input type="text" name='username' value='hello'/><br />
		密码 : <input type="password" name='password'><br />
		性别: <input type="radio" name='sex' value='1' checked='checked'>男
			<input type="radio" name='sex' value='0'>女<br />
		爱好: <input type="checkbox" name='hobby[]' value='篮球'>篮球
			<input type="checkbox" name='hobby[]' value='足球'>足球
			<input type="checkbox" name='hobby[]' value='乒乓球'>乒乓球
			<input type="checkbox" name='hobby[]' value='排球'>排球<br />
		城市: <select name="city" id="">
				<option value="1">北京</option>
				<option value="2">上海</option>
				<option value="3">重庆</option>
				<option value="4" selected='selected'>天津</option>
			 </select><br />
		介绍: <textarea name="" id="text" cols="30" rows="10" style="resize:none">明天开学,作业怎么办</textarea><br />
	<button>提交</button>
	</form>

	<script type="text/javascript">
	//输入框值的获取和设置
		var inpt = document.getElementsByName('username')[0];

		//获取值
		var v = inpt.value;
		//设置值
		inpt.value = 'hello world';

	//单选框值的获取和设置
		var sexs = document.getElementsByName('sex');

		for(var i= 0;i<sexs.length;i++){
			//获取checked的值
			var che = sexs[i].getAttribute('checked');

			//判断
			if(che == 'checked'){

				//alert(sexs[i].value);
			}

			//获取是否选中   结果是boolean  true false
			var chec = sexs[i].checked;
			if(chec){

				//alert(sexs[i].value);
			}

			//console.log(chec);
		}
		//设置值
		sexs[1].setAttribute('checked','checked');



	//下拉框的获取和设置
		var sel = document.getElementsByName('city')[0];

		//获取值
		//var vs = sel.value;
		//改变值
		//sel.value = '2';

		//console.log(vs);
		var op = document.getElementsByTagName('option');
		//遍历数组
		for (var i = 0; i < op.length; i++) {
			//判断是否选中的状态   boolean
			if(op[i].selected){
				//弹出标签中的文本
				alert(op[i].innerHTML);
			}
			
		};

	//文本域的获取和设置
	var text = document.getElementById('text');

	//获取值
	alert(text.value);
	//设置值
	text.value='iloveyou';


	//事件绑定
	//1.标签属性
	<div onclick="func()"></div>

	fucntion func()
	{
		alert('2134');
	}

	//2.获取元素
	res.onclick = function()
	{

	}

	//3.addEventListener  
	res.addEventListner('click',function()
	{
		alert('3456');
	})

	</script>
</body>
</html>